﻿@namespace Blazorise.Docs.Docs.Examples

<Table Bordered FixedColumns>
    <TableHeader>
        <TableRow>
            <TableHeaderCell Width="@Width.Px(50)" FixedPosition="TableColumnFixedPosition.Start">#</TableHeaderCell>
            <TableHeaderCell Width="@Width.Px(100)">Column 1</TableHeaderCell>
            <TableHeaderCell Width="@Width.Px(150)" FixedPosition="TableColumnFixedPosition.Start">Fixed heading</TableHeaderCell>
            <TableHeaderCell Width="@Width.Px(100)">Column 2</TableHeaderCell>
            <TableHeaderCell Width="@Width.Px(450)">Column 3</TableHeaderCell>
            <TableHeaderCell Width="@Width.Px(230)">Column 4</TableHeaderCell>
            <TableHeaderCell Width="@Width.Px(220)" FixedPosition="TableColumnFixedPosition.End">Fixed end heading</TableHeaderCell>
            <TableHeaderCell Width="@Width.Px(200)" FixedPosition="TableColumnFixedPosition.End">Fixed end heading</TableHeaderCell>
        </TableRow>
    </TableHeader>
    <TableBody>
        @for ( int i = 1; i <= 3; ++i )
        {
            var index = i.ToString();

            <TableRow @key="@index">
                <TableRowHeader Width="@Width.Px(50)" FixedPosition="TableColumnFixedPosition.Start">@index</TableRowHeader>
                <TableRowCell Width="@Width.Px(100)">Column 1</TableRowCell>
                <TableRowCell Width="@Width.Px(150)" FixedPosition="TableColumnFixedPosition.Start">Fixed column</TableRowCell>
                <TableRowCell Width="@Width.Px(200)">Column 2</TableRowCell>
                <TableRowCell Width="@Width.Px(450)">Column 3</TableRowCell>
                <TableRowCell Width="@Width.Px(230)">Column 4</TableRowCell>
                <TableRowCell Width="@Width.Px(220)" FixedPosition="TableColumnFixedPosition.End">Fixed end content</TableRowCell>
                <TableRowCell Width="@Width.Px(200)" FixedPosition="TableColumnFixedPosition.End">Fixed end content</TableRowCell>
            </TableRow>
        }
    </TableBody>
</Table>